<template>
	<view class="login-form"> 
		<!-- 注意，如果需要兼容微信小程序，最好通过setRules方法设置rules规则 -->
		<u--form labelPosition="left" :model="userInfo"  ref="form1">
<!-- 			<u-form-item label="姓名" prop="userInfo.username" borderBottom>
				<u--input v-model="userInfo.username" border="none"></u--input>
			</u-form-item> -->
			<u-form-item label="密码" prop="userInfo.password" borderBottom>
				<u--input v-model="userInfo.password" border="none"></u--input>
			</u-form-item>
			<u-form-item label="手机号" prop="userInfo.mobile" borderBottom>
				<u--input v-model="userInfo.mobile" border="none"></u--input>
			</u-form-item> 
			<u-form-item label="验证码" prop="userInfo.code" borderBottom>
				<u--input v-model="userInfo.code" border="none"></u--input>
			</u-form-item>

			<u-button type="primary" @click="submit">提交</u-button>
		</u--form>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				userInfo: {
					// mobile: '',
					password: '',
					mobile:'',
					code:''
				},


				rules: {
					'userInfo.mobile': {
						type: 'string',
						required: true,
						message: '请填写姓名',
						trigger: ['blur', 'change']
					},
					'userInfo.password': {
						type: 'string',
						required: true,
						message: '请填写密码',
						trigger: ['blur', 'change']
					},
				},

			};
		},
		methods: {
			submit() {
				console.log(this.userInfo);
				//  校验  


				let userInfo = this.userInfo
				uni.$u.http.post('/user/register', userInfo).then(res => {

					console.log(res);


				}).catch(err => {

				})



			}
		},
		onReady() {
			//如果需要兼容微信小程序，并且校验规则中含有方法等，只能通过setRules方法设置规则。
			this.$refs.form1.setRules(this.rules)
		},
	};
</script>
<style lang="scss">
	.login-form {
		padding: 0 30rpx;
	}
</style>
